<template>
	<view class="tab-title-item">
		<view class="left">
			<view>{{title}}
				<view class="title"></view>
			</view>
		</view>
		<view class="right">
			<slot name='right'></slot>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			title: {
				type: String,
				default: ""
			}
		},
		data() {
			return {}
		},
		mounted() {}
	}
</script>

<style lang="scss" scoped>
	.tab-title-item {

		display: flex;
		align-items: center;
		justify-content: space-between;

		.left {
			font-family: PingFang SC, PingFang SC;
			font-weight: 800;
			font-size: 32rpx;
			color: #000000;
			line-height: 38rpx;
			text-align: left;
			font-style: normal;
			text-transform: none;

			.title {
				content: "";
				height: 10rpx;
				background: #FCD610;
				border-radius: 6rpx 6rpx 6rpx 6rpx;
				width: calc(100% + 24rpx);
				margin-left: -12rpx;
			}
		}
	}
</style>